<!DOCTYPE html><html><head>
      <title>2.一体机框架</title>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      
      <link rel="stylesheet" href="file:////Users/jiuyue/.vscode/extensions/shd101wyy.markdown-preview-enhanced-0.8.15/crossnote/dependencies/katex/katex.min.css">
      
      
      
      
      
      <style>
      code[class*=language-],pre[class*=language-]{color:#333;background:0 0;font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.4;-moz-tab-size:8;-o-tab-size:8;tab-size:8;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:.8em;overflow:auto;border-radius:3px;background:#f5f5f5}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal;background:#f5f5f5}.token.blockquote,.token.comment{color:#969896}.token.cdata{color:#183691}.token.doctype,.token.macro.property,.token.punctuation,.token.variable{color:#333}.token.builtin,.token.important,.token.keyword,.token.operator,.token.rule{color:#a71d5d}.token.attr-value,.token.regex,.token.string,.token.url{color:#183691}.token.atrule,.token.boolean,.token.code,.token.command,.token.constant,.token.entity,.token.number,.token.property,.token.symbol{color:#0086b3}.token.prolog,.token.selector,.token.tag{color:#63a35c}.token.attr-name,.token.class,.token.class-name,.token.function,.token.id,.token.namespace,.token.pseudo-class,.token.pseudo-element,.token.url-reference .token.variable{color:#795da3}.token.entity{cursor:help}.token.title,.token.title .token.punctuation{font-weight:700;color:#1d3e81}.token.list{color:#ed6a43}.token.inserted{background-color:#eaffea;color:#55a532}.token.deleted{background-color:#ffecec;color:#bd2c00}.token.bold{font-weight:700}.token.italic{font-style:italic}.language-json .token.property{color:#183691}.language-markup .token.tag .token.punctuation{color:#333}.language-css .token.function,code.language-css{color:#0086b3}.language-yaml .token.atrule{color:#63a35c}code.language-yaml{color:#183691}.language-ruby .token.function{color:#333}.language-markdown .token.url{color:#795da3}.language-makefile .token.symbol{color:#795da3}.language-makefile .token.variable{color:#183691}.language-makefile .token.builtin{color:#0086b3}.language-bash .token.keyword{color:#0086b3}pre[data-line]{position:relative;padding:1em 0 1em 3em}pre[data-line] .line-highlight-wrapper{position:absolute;top:0;left:0;background-color:transparent;display:block;width:100%}pre[data-line] .line-highlight{position:absolute;left:0;right:0;padding:inherit 0;margin-top:1em;background:hsla(24,20%,50%,.08);background:linear-gradient(to right,hsla(24,20%,50%,.1) 70%,hsla(24,20%,50%,0));pointer-events:none;line-height:inherit;white-space:pre}pre[data-line] .line-highlight:before,pre[data-line] .line-highlight[data-end]:after{content:attr(data-start);position:absolute;top:.4em;left:.6em;min-width:1em;padding:0 .5em;background-color:hsla(24,20%,50%,.4);color:#f4f1ef;font:bold 65%/1.5 sans-serif;text-align:center;vertical-align:.3em;border-radius:999px;text-shadow:none;box-shadow:0 1px #fff}pre[data-line] .line-highlight[data-end]:after{content:attr(data-end);top:auto;bottom:.4em}html body{font-family:'Helvetica Neue',Helvetica,'Segoe UI',Arial,freesans,sans-serif;font-size:16px;line-height:1.6;color:#333;background-color:#fff;overflow:initial;box-sizing:border-box;word-wrap:break-word}html body>:first-child{margin-top:0}html body h1,html body h2,html body h3,html body h4,html body h5,html body h6{line-height:1.2;margin-top:1em;margin-bottom:16px;color:#000}html body h1{font-size:2.25em;font-weight:300;padding-bottom:.3em}html body h2{font-size:1.75em;font-weight:400;padding-bottom:.3em}html body h3{font-size:1.5em;font-weight:500}html body h4{font-size:1.25em;font-weight:600}html body h5{font-size:1.1em;font-weight:600}html body h6{font-size:1em;font-weight:600}html body h1,html body h2,html body h3,html body h4,html body h5{font-weight:600}html body h5{font-size:1em}html body h6{color:#5c5c5c}html body strong{color:#000}html body del{color:#5c5c5c}html body a:not([href]){color:inherit;text-decoration:none}html body a{color:#08c;text-decoration:none}html body a:hover{color:#00a3f5;text-decoration:none}html body img{max-width:100%}html body>p{margin-top:0;margin-bottom:16px;word-wrap:break-word}html body>ol,html body>ul{margin-bottom:16px}html body ol,html body ul{padding-left:2em}html body ol.no-list,html body ul.no-list{padding:0;list-style-type:none}html body ol ol,html body ol ul,html body ul ol,html body ul ul{margin-top:0;margin-bottom:0}html body li{margin-bottom:0}html body li.task-list-item{list-style:none}html body li>p{margin-top:0;margin-bottom:0}html body .task-list-item-checkbox{margin:0 .2em .25em -1.8em;vertical-align:middle}html body .task-list-item-checkbox:hover{cursor:pointer}html body blockquote{margin:16px 0;font-size:inherit;padding:0 15px;color:#5c5c5c;background-color:#f0f0f0;border-left:4px solid #d6d6d6}html body blockquote>:first-child{margin-top:0}html body blockquote>:last-child{margin-bottom:0}html body hr{height:4px;margin:32px 0;background-color:#d6d6d6;border:0 none}html body table{margin:10px 0 15px 0;border-collapse:collapse;border-spacing:0;display:block;width:100%;overflow:auto;word-break:normal;word-break:keep-all}html body table th{font-weight:700;color:#000}html body table td,html body table th{border:1px solid #d6d6d6;padding:6px 13px}html body dl{padding:0}html body dl dt{padding:0;margin-top:16px;font-size:1em;font-style:italic;font-weight:700}html body dl dd{padding:0 16px;margin-bottom:16px}html body code{font-family:Menlo,Monaco,Consolas,'Courier New',monospace;font-size:.85em;color:#000;background-color:#f0f0f0;border-radius:3px;padding:.2em 0}html body code::after,html body code::before{letter-spacing:-.2em;content:'\00a0'}html body pre>code{padding:0;margin:0;word-break:normal;white-space:pre;background:0 0;border:0}html body .highlight{margin-bottom:16px}html body .highlight pre,html body pre{padding:1em;overflow:auto;line-height:1.45;border:#d6d6d6;border-radius:3px}html body .highlight pre{margin-bottom:0;word-break:normal}html body pre code,html body pre tt{display:inline;max-width:initial;padding:0;margin:0;overflow:initial;line-height:inherit;word-wrap:normal;background-color:transparent;border:0}html body pre code:after,html body pre code:before,html body pre tt:after,html body pre tt:before{content:normal}html body blockquote,html body dl,html body ol,html body p,html body pre,html body ul{margin-top:0;margin-bottom:16px}html body kbd{color:#000;border:1px solid #d6d6d6;border-bottom:2px solid #c7c7c7;padding:2px 4px;background-color:#f0f0f0;border-radius:3px}@media print{html body{background-color:#fff}html body h1,html body h2,html body h3,html body h4,html body h5,html body h6{color:#000;page-break-after:avoid}html body blockquote{color:#5c5c5c}html body pre{page-break-inside:avoid}html body table{display:table}html body img{display:block;max-width:100%;max-height:100%}html body code,html body pre{word-wrap:break-word;white-space:pre}}.markdown-preview{width:100%;height:100%;box-sizing:border-box}.markdown-preview ul{list-style:disc}.markdown-preview ul ul{list-style:circle}.markdown-preview ul ul ul{list-style:square}.markdown-preview ol{list-style:decimal}.markdown-preview ol ol,.markdown-preview ul ol{list-style-type:lower-roman}.markdown-preview ol ol ol,.markdown-preview ol ul ol,.markdown-preview ul ol ol,.markdown-preview ul ul ol{list-style-type:lower-alpha}.markdown-preview .newpage,.markdown-preview .pagebreak{page-break-before:always}.markdown-preview pre.line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}.markdown-preview pre.line-numbers>code{position:relative}.markdown-preview pre.line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:1em;font-size:100%;left:0;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.markdown-preview pre.line-numbers .line-numbers-rows>span{pointer-events:none;display:block;counter-increment:linenumber}.markdown-preview pre.line-numbers .line-numbers-rows>span:before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}.markdown-preview .mathjax-exps .MathJax_Display{text-align:center!important}.markdown-preview:not([data-for=preview]) .code-chunk .code-chunk-btn-group{display:none}.markdown-preview:not([data-for=preview]) .code-chunk .status{display:none}.markdown-preview:not([data-for=preview]) .code-chunk .output-div{margin-bottom:16px}.markdown-preview .md-toc{padding:0}.markdown-preview .md-toc .md-toc-link-wrapper .md-toc-link{display:inline;padding:.25rem 0}.markdown-preview .md-toc .md-toc-link-wrapper .md-toc-link div,.markdown-preview .md-toc .md-toc-link-wrapper .md-toc-link p{display:inline}.markdown-preview .md-toc .md-toc-link-wrapper.highlighted .md-toc-link{font-weight:800}.scrollbar-style::-webkit-scrollbar{width:8px}.scrollbar-style::-webkit-scrollbar-track{border-radius:10px;background-color:transparent}.scrollbar-style::-webkit-scrollbar-thumb{border-radius:5px;background-color:rgba(150,150,150,.66);border:4px solid rgba(150,150,150,.66);background-clip:content-box}html body[for=html-export]:not([data-presentation-mode]){position:relative;width:100%;height:100%;top:0;left:0;margin:0;padding:0;overflow:auto}html body[for=html-export]:not([data-presentation-mode]) .markdown-preview{position:relative;top:0;min-height:100vh}@media screen and (min-width:914px){html body[for=html-export]:not([data-presentation-mode]) .markdown-preview{padding:2em calc(50% - 457px + 2em)}}@media screen and (max-width:914px){html body[for=html-export]:not([data-presentation-mode]) .markdown-preview{padding:2em}}@media screen and (max-width:450px){html body[for=html-export]:not([data-presentation-mode]) .markdown-preview{font-size:14px!important;padding:1em}}@media print{html body[for=html-export]:not([data-presentation-mode]) #sidebar-toc-btn{display:none}}html body[for=html-export]:not([data-presentation-mode]) #sidebar-toc-btn{position:fixed;bottom:8px;left:8px;font-size:28px;cursor:pointer;color:inherit;z-index:99;width:32px;text-align:center;opacity:.4}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] #sidebar-toc-btn{opacity:1}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc{position:fixed;top:0;left:0;width:300px;height:100%;padding:32px 0 48px 0;font-size:14px;box-shadow:0 0 4px rgba(150,150,150,.33);box-sizing:border-box;overflow:auto;background-color:inherit}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc::-webkit-scrollbar{width:8px}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc::-webkit-scrollbar-track{border-radius:10px;background-color:transparent}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc::-webkit-scrollbar-thumb{border-radius:5px;background-color:rgba(150,150,150,.66);border:4px solid rgba(150,150,150,.66);background-clip:content-box}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc a{text-decoration:none}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc .md-toc{padding:0 16px}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc .md-toc .md-toc-link-wrapper .md-toc-link{display:inline;padding:.25rem 0}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc .md-toc .md-toc-link-wrapper .md-toc-link div,html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc .md-toc .md-toc-link-wrapper .md-toc-link p{display:inline}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .md-sidebar-toc .md-toc .md-toc-link-wrapper.highlighted .md-toc-link{font-weight:800}html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .markdown-preview{left:300px;width:calc(100% - 300px);padding:2em calc(50% - 457px - 300px / 2);margin:0;box-sizing:border-box}@media screen and (max-width:1274px){html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .markdown-preview{padding:2em}}@media screen and (max-width:450px){html body[for=html-export]:not([data-presentation-mode])[html-show-sidebar-toc] .markdown-preview{width:100%}}html body[for=html-export]:not([data-presentation-mode]):not([html-show-sidebar-toc]) .markdown-preview{left:50%;transform:translateX(-50%)}html body[for=html-export]:not([data-presentation-mode]):not([html-show-sidebar-toc]) .md-sidebar-toc{display:none}
/* Please visit the URL below for more information: */
/*   https://shd101wyy.github.io/markdown-preview-enhanced/#/customize-css */

      </style>
      <!-- The content below will be included at the end of the <head> element. --><script type="text/javascript">
  document.addEventListener("DOMContentLoaded", function () {
    // your code here
  });
</script></head><body for="html-export">
    
    
      <div class="crossnote markdown-preview  ">
      
<h2 id="1-核心概念与项目结构">1. 核心概念与项目结构 </h2>
<h3 id="11-为什么状态管理选择-getx">1.1 为什么状态管理选择 GetX？ </h3>
<ul>
<li><strong>轻量高效</strong>：无需 <code>context</code> 即可操作路由和状态。</li>
<li><strong>功能集成</strong>：状态管理、路由导航、依赖注入三合一。</li>
<li><strong>响应式编程</strong>：通过 <code>Rx</code> 和 <code>Obx</code> 简化 UI 更新。</li>
</ul>
<h3 id="12-项目目录结构">1.2 项目目录结构 </h3>
<pre data-role="codeBlock" data-info="" class="language-text"><code>assets/                   # 资源文件
├── images/               # 图片资源
├── fonts/                # 字体文件
lib/
├── app/                  # 应用全局配置
│   ├── app.dart          # GetMaterialApp 初始化
│   ├── routes.dart       # 路由表
│   └── theme.dart        # 主题定义
├── pages/                # 页面视图
├── models/               # 数据模型
├── net/                  # 网络层
├── services/             # 服务层（API、存储等）
├── utils/                # 工具类
│   ├── extensions/       # Dart 扩展方法
│   └── helpers/          # 通用工具类
├── widgets/              # 可复用组件
└── main.dart             # 应用入口
</code></pre><hr>
<h2 id="2-状态管理getx-controller">2. 状态管理：GetX Controller </h2>
<h3 id="21-控制器的作用">2.1 控制器的作用 </h3>
<ul>
<li>管理页面或模块的状态。</li>
<li>处理业务逻辑（如 API 调用）。</li>
<li>通过 <code>Get.put()</code> 全局注入。</li>
</ul>
<h3 id="22-创建控制器">2.2 创建控制器 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token keyword keyword-import">import</span> <span class="token string-literal"><span class="token string">'package:get/get.dart'</span></span><span class="token punctuation">;</span>

<span class="token keyword keyword-class">class</span> <span class="token class-name">FindJobController</span> <span class="token keyword keyword-extends">extends</span> <span class="token class-name">GetxController</span> <span class="token punctuation">{</span>
   <span class="token class-name">RxInt</span>  taskCount <span class="token operator">=</span> <span class="token number">0.</span>obs<span class="token punctuation">;</span>

   <span class="token function">requestTaskCount</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token keyword keyword-async">async</span> <span class="token punctuation">{</span>
      <span class="token class-name">TaskCount</span><span class="token operator">?</span> countModel  <span class="token operator">=</span> <span class="token keyword keyword-await">await</span> <span class="token class-name">AppRepository</span><span class="token punctuation">.</span><span class="token function">getInstance</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">taskCount</span><span class="token punctuation">(</span>
        city<span class="token punctuation">:</span> <span class="token class-name">HomeController</span><span class="token punctuation">.</span>find<span class="token punctuation">.</span>deviceConfig<span class="token operator">?</span><span class="token punctuation">.</span>city<span class="token punctuation">,</span>
      <span class="token punctuation">)</span><span class="token punctuation">;</span>
      <span class="token function">taskCount</span><span class="token punctuation">(</span>countModel<span class="token operator">?</span><span class="token punctuation">.</span>mapCount <span class="token operator">?</span><span class="token operator">?</span> <span class="token number">0</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre><h3 id="23-在视图中绑定状态">2.3 在视图中绑定状态 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token keyword keyword-class">class</span> <span class="token class-name">FindJobPage</span> <span class="token keyword keyword-extends">extends</span> <span class="token class-name">StatelessWidget</span> <span class="token punctuation">{</span>
  <span class="token class-name">FindJobController</span> findJobController <span class="token operator">=</span> <span class="token class-name">Get</span><span class="token punctuation">.</span><span class="token function">put</span><span class="token punctuation">(</span><span class="token class-name">FindJobController</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

  <span class="token metadata function">@override</span>
  <span class="token class-name">Widget</span> <span class="token function">build</span><span class="token punctuation">(</span><span class="token class-name">BuildContext</span> context<span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword keyword-return">return</span> <span class="token class-name">Scaffold</span><span class="token punctuation">(</span>
      body<span class="token punctuation">:</span> <span class="token class-name">Obx</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">&gt;</span> <span class="token class-name">Text</span><span class="token punctuation">(</span>
                        <span class="token string-literal"><span class="token string">'附近：</span><span class="token interpolation"><span class="token punctuation">${</span><span class="token expression">findJobController<span class="token punctuation">.</span>taskCount<span class="token punctuation">.</span>value</span><span class="token punctuation">}</span></span><span class="token string">个好活'</span></span><span class="token punctuation">,</span>
                        style<span class="token punctuation">:</span> <span class="token class-name">TextStyle</span><span class="token punctuation">(</span>
                                fontSize<span class="token punctuation">:</span> <span class="token number">15.</span>sp<span class="token punctuation">,</span>
                                  color<span class="token punctuation">:</span> <span class="token class-name">Colors</span><span class="token punctuation">.</span>white<span class="token punctuation">,</span>
                                      <span class="token punctuation">)</span><span class="token punctuation">,</span>
                        <span class="token punctuation">)</span><span class="token punctuation">,</span>
                    <span class="token punctuation">)</span><span class="token punctuation">,</span>
   
    <span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre><p><strong>关键点</strong>：</p>
<ul>
<li><code>Obx(() =&gt; ...)</code> 监听 <code>Rx</code> 变量变化。</li>
<li><code>Get.put()</code> 将控制器注入依赖树。</li>
</ul>
<hr>
<h2 id="3-路由管理">3. 路由管理 </h2>
<h3 id="31-定义路由表">3.1 定义路由表 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token keyword keyword-class">class</span> <span class="token class-name">Routes</span> <span class="token punctuation">{</span>
  <span class="token comment">//首页</span>
  <span class="token keyword keyword-static">static</span> <span class="token keyword keyword-const">const</span> home <span class="token operator">=</span> <span class="token string-literal"><span class="token string">'/home'</span></span><span class="token punctuation">;</span>
  <span class="token comment">// 登录</span>
  <span class="token keyword keyword-static">static</span> <span class="token keyword keyword-const">const</span> login <span class="token operator">=</span> <span class="token string-literal"><span class="token string">'/login'</span></span><span class="token punctuation">;</span>
  <span class="token comment">// 我要找活</span>
  <span class="token keyword keyword-static">static</span> <span class="token keyword keyword-const">const</span> findJobPage <span class="token operator">=</span> <span class="token string-literal"><span class="token string">'/findJobPage'</span></span><span class="token punctuation">;</span>

  <span class="token keyword keyword-static">static</span> <span class="token keyword keyword-final">final</span> pages <span class="token operator">=</span> <span class="token punctuation">[</span>
    <span class="token class-name">GetPage</span><span class="token punctuation">(</span>name<span class="token punctuation">:</span> home<span class="token punctuation">,</span> page<span class="token punctuation">:</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">&gt;</span> <span class="token keyword keyword-const">const</span> <span class="token class-name">HomePage</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
    <span class="token class-name">GetPage</span><span class="token punctuation">(</span>name<span class="token punctuation">:</span> login<span class="token punctuation">,</span> page<span class="token punctuation">:</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">&gt;</span> <span class="token keyword keyword-const">const</span> <span class="token class-name">LoginPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
    <span class="token class-name">GetPage</span><span class="token punctuation">(</span>name<span class="token punctuation">:</span> findJobPage<span class="token punctuation">,</span> page<span class="token punctuation">:</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">&gt;</span> <span class="token keyword keyword-const">const</span> <span class="token class-name">FindJobPage</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
  <span class="token punctuation">]</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
</code></pre><h3 id="32-配置路由">3.2 配置路由 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token keyword keyword-class">class</span> <span class="token class-name">App</span> <span class="token keyword keyword-extends">extends</span> <span class="token class-name">StatelessWidget</span> <span class="token punctuation">{</span>
  <span class="token metadata function">@override</span>
  <span class="token class-name">Widget</span> <span class="token function">build</span><span class="token punctuation">(</span><span class="token class-name">BuildContext</span> context<span class="token punctuation">)</span> <span class="token punctuation">{</span>
    <span class="token keyword keyword-return">return</span> <span class="token class-name">GetMaterialApp</span><span class="token punctuation">(</span>
      initialRoute<span class="token punctuation">:</span> <span class="token class-name">Routes</span><span class="token punctuation">.</span>home<span class="token punctuation">,</span>
      getPages<span class="token punctuation">:</span> <span class="token class-name">Routes</span><span class="token punctuation">.</span>pages<span class="token punctuation">,</span>
    <span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre><h3 id="33-路由跳转">3.3 路由跳转 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token comment">// 跳转到详情页</span>
<span class="token class-name">Get</span><span class="token punctuation">.</span><span class="token function">toNamed</span><span class="token punctuation">(</span><span class="token class-name">Routes</span><span class="token punctuation">.</span>findJobPage<span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">// 带参数跳转</span>
<span class="token class-name">Get</span><span class="token punctuation">.</span><span class="token function">toNamed</span><span class="token punctuation">(</span><span class="token class-name">Routes</span><span class="token punctuation">.</span>findJobPage<span class="token punctuation">,</span> arguments<span class="token punctuation">:</span> <span class="token punctuation">{</span><span class="token string-literal"><span class="token string">'id'</span></span><span class="token punctuation">:</span> <span class="token number">123</span><span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">// 获取参数</span>
<span class="token keyword keyword-final">final</span> args <span class="token operator">=</span> <span class="token class-name">Get</span><span class="token punctuation">.</span>arguments<span class="token punctuation">;</span>

<span class="token comment">// 返回上一页</span>
<span class="token class-name">Get</span><span class="token punctuation">.</span><span class="token function">back</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">//详细参见官方文档：https://pub.dev/packages/get#routing</span>
</code></pre><hr>
<h2 id="4-网络层">4. 网络层 </h2>
<h3 id="41-网络层封装">4.1 网络层封装 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token comment">//网络请求</span>
<span class="token keyword keyword-class">class</span> <span class="token class-name">AppHttp</span> <span class="token punctuation">{</span>
  <span class="token keyword keyword-factory">factory</span> <span class="token class-name">AppHttp</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=</span><span class="token operator">&gt;</span> <span class="token function">_getInstance</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token keyword keyword-static">static</span> <span class="token class-name">AppHttp</span> <span class="token keyword keyword-get">get</span> instance <span class="token operator">=</span><span class="token operator">&gt;</span> <span class="token function">_getInstance</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token keyword keyword-static">static</span> <span class="token class-name">AppHttp</span><span class="token operator">?</span> _instance<span class="token punctuation">;</span>
  <span class="token keyword keyword-static">static</span> <span class="token class-name">Duration</span> connectTimeout <span class="token operator">=</span> <span class="token keyword keyword-const">const</span> <span class="token class-name">Duration</span><span class="token punctuation">(</span>seconds<span class="token punctuation">:</span> <span class="token number">30</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token keyword keyword-static">static</span> <span class="token class-name">Duration</span> receiveTimeout <span class="token operator">=</span> <span class="token keyword keyword-const">const</span> <span class="token class-name">Duration</span><span class="token punctuation">(</span>seconds<span class="token punctuation">:</span> <span class="token number">30</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token keyword keyword-final">final</span> <span class="token class-name">Dio</span> _dio <span class="token operator">=</span> <span class="token class-name">Dio</span><span class="token punctuation">(</span>
    <span class="token class-name">BaseOptions</span><span class="token punctuation">(</span>
      connectTimeout<span class="token punctuation">:</span> connectTimeout<span class="token punctuation">,</span>
      receiveTimeout<span class="token punctuation">:</span> receiveTimeout<span class="token punctuation">,</span>
      responseType<span class="token punctuation">:</span> <span class="token class-name">ResponseType</span><span class="token punctuation">.</span>plain<span class="token punctuation">,</span>
      contentType<span class="token punctuation">:</span> <span class="token class-name">ContentType</span><span class="token punctuation">.</span>json<span class="token punctuation">.</span>mimeType<span class="token punctuation">,</span>
      baseUrl<span class="token punctuation">:</span> <span class="token class-name">NetConfig</span><span class="token punctuation">.</span>host<span class="token punctuation">,</span>
    <span class="token punctuation">)</span><span class="token punctuation">,</span>
  <span class="token punctuation">)</span><span class="token punctuation">;</span>

  <span class="token comment">///添加拦截器</span>
  <span class="token class-name">AppHttp</span><span class="token punctuation">.</span><span class="token function">_internal</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    _dio<span class="token punctuation">.</span>interceptors<span class="token punctuation">.</span><span class="token function">add</span><span class="token punctuation">(</span><span class="token class-name">AuthInterceptor</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span>

  <span class="token comment">///单例模式</span>
  <span class="token keyword keyword-static">static</span> <span class="token class-name">AppHttp</span> <span class="token function">_getInstance</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
    _instance <span class="token operator">?</span><span class="token operator">?</span><span class="token operator">=</span> <span class="token class-name">AppHttp</span><span class="token punctuation">.</span><span class="token function">_internal</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token keyword keyword-return">return</span> _instance<span class="token operator">!</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span>

  <span class="token comment">///常规请求</span>
  <span class="token keyword keyword-static">static</span> <span class="token class-name">Future</span><span class="token generics"><span class="token punctuation">&lt;</span><span class="token class-name">HttpResult</span><span class="token punctuation">&gt;</span></span> <span class="token function">request</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span>
</code></pre><h3 id="42-在控制器中使用网络请求">4.2 在控制器中使用网络请求 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token keyword keyword-class">class</span> <span class="token class-name">HomeController</span> <span class="token keyword keyword-extends">extends</span> <span class="token class-name">GetxController</span> <span class="token punctuation">{</span>
  <span class="token keyword keyword-static">static</span> <span class="token class-name">HomeController</span> <span class="token keyword keyword-get">get</span> find <span class="token operator">=</span><span class="token operator">&gt;</span> <span class="token class-name">Get</span><span class="token punctuation">.</span>find<span class="token generics"><span class="token punctuation">&lt;</span><span class="token class-name">HomeController</span><span class="token punctuation">&gt;</span></span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

  <span class="token class-name">DeviceConfig</span><span class="token operator">?</span> deviceConfig<span class="token punctuation">;</span>
  <span class="token function">requsetDeviceData</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token keyword keyword-async">async</span> <span class="token punctuation">{</span>
    deviceConfig <span class="token operator">=</span> <span class="token keyword keyword-await">await</span> <span class="token class-name">AppRepository</span><span class="token punctuation">.</span><span class="token function">getInstance</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">deviceConfig</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">}</span>

</code></pre><h3 id="43-在services-中-app_repositorydart-网络请求方法">4.3 在services 中 app_repository.dart 网络请求方法 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code>  <span class="token comment">///设备信息</span>
  <span class="token class-name">Future</span><span class="token generics"><span class="token punctuation">&lt;</span><span class="token class-name">DeviceConfig</span><span class="token operator">?</span><span class="token punctuation">&gt;</span></span> <span class="token function">deviceConfig</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token class-name">String</span><span class="token operator">?</span> deviceCode<span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token keyword keyword-async">async</span> <span class="token punctuation">{</span>
    <span class="token class-name">Map</span><span class="token generics"><span class="token punctuation">&lt;</span><span class="token class-name">String</span><span class="token punctuation">,</span> <span class="token keyword keyword-dynamic">dynamic</span><span class="token punctuation">&gt;</span></span> params <span class="token operator">=</span> <span class="token punctuation">{</span>
      <span class="token string-literal"><span class="token string">'device_code'</span></span><span class="token punctuation">:</span> deviceCode <span class="token operator">?</span><span class="token operator">?</span> <span class="token string-literal"><span class="token string">'173891070235385329'</span></span><span class="token punctuation">,</span>
    <span class="token punctuation">}</span><span class="token punctuation">;</span>
    <span class="token class-name">HttpResult</span> result <span class="token operator">=</span> <span class="token keyword keyword-await">await</span> <span class="token class-name">AppHttp</span><span class="token punctuation">.</span><span class="token function">request</span><span class="token punctuation">(</span>
        url<span class="token punctuation">:</span> <span class="token class-name">ApiUrl</span><span class="token punctuation">.</span>deviceConfig<span class="token punctuation">,</span> method<span class="token punctuation">:</span> <span class="token string-literal"><span class="token string">'get'</span></span><span class="token punctuation">,</span> params<span class="token punctuation">:</span> params<span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token keyword keyword-if">if</span> <span class="token punctuation">(</span>result<span class="token punctuation">.</span>isSuccess<span class="token punctuation">)</span> <span class="token punctuation">{</span>
      <span class="token keyword keyword-return">return</span> <span class="token class-name">DeviceConfig</span><span class="token punctuation">.</span><span class="token function">fromJson</span><span class="token punctuation">(</span>result<span class="token punctuation">.</span>data<span class="token punctuation">)</span><span class="token punctuation">;</span>
    <span class="token punctuation">}</span>
    <span class="token keyword keyword-return">return</span> <span class="token keyword keyword-null">null</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span>

</code></pre><h3 id="44-json转model">4.4 Json转Model </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token keyword keyword-class">class</span> <span class="token class-name">DeviceConfig</span> <span class="token punctuation">{</span>
  int<span class="token operator">?</span> id<span class="token punctuation">;</span>
  <span class="token class-name">String</span><span class="token operator">?</span> deviceName<span class="token punctuation">;</span>
  <span class="token class-name">String</span><span class="token operator">?</span> deviceCode<span class="token punctuation">;</span>
  <span class="token class-name">String</span><span class="token operator">?</span> configuration<span class="token punctuation">;</span>
  <span class="token class-name">String</span><span class="token operator">?</span> createTime<span class="token punctuation">;</span>
  <span class="token class-name">DeviceConfig</span><span class="token punctuation">(</span>
      <span class="token punctuation">{</span><span class="token keyword keyword-this">this</span><span class="token punctuation">.</span>id<span class="token punctuation">,</span>
      <span class="token keyword keyword-this">this</span><span class="token punctuation">.</span>deviceName<span class="token punctuation">,</span>
      <span class="token keyword keyword-this">this</span><span class="token punctuation">.</span>deviceCode<span class="token punctuation">,</span>
      <span class="token keyword keyword-this">this</span><span class="token punctuation">.</span>configuration<span class="token punctuation">,</span>
      <span class="token keyword keyword-this">this</span><span class="token punctuation">.</span>createTime<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token class-name">DeviceConfig</span><span class="token punctuation">.</span><span class="token function">fromJson</span><span class="token punctuation">(</span><span class="token class-name">Map</span><span class="token generics"><span class="token punctuation">&lt;</span><span class="token class-name">String</span><span class="token punctuation">,</span> <span class="token keyword keyword-dynamic">dynamic</span><span class="token punctuation">&gt;</span></span> json<span class="token punctuation">)</span> <span class="token punctuation">{</span>
    id <span class="token operator">=</span> json<span class="token punctuation">[</span><span class="token string-literal"><span class="token string">'id'</span></span><span class="token punctuation">]</span><span class="token punctuation">;</span>
    deviceName <span class="token operator">=</span> json<span class="token punctuation">[</span><span class="token string-literal"><span class="token string">'device_name'</span></span><span class="token punctuation">]</span><span class="token punctuation">;</span>
    deviceCode <span class="token operator">=</span> json<span class="token punctuation">[</span><span class="token string-literal"><span class="token string">'device_code'</span></span><span class="token punctuation">]</span><span class="token punctuation">;</span>
    configuration <span class="token operator">=</span> json<span class="token punctuation">[</span><span class="token string-literal"><span class="token string">'configuration'</span></span><span class="token punctuation">]</span><span class="token punctuation">;</span>
    createTime <span class="token operator">=</span> json<span class="token punctuation">[</span><span class="token string-literal"><span class="token string">'create_time'</span></span><span class="token punctuation">]</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
 网站<span class="token number">1</span>： https<span class="token punctuation">:</span><span class="token operator">/</span><span class="token operator">/</span>javiercbk<span class="token punctuation">.</span>github<span class="token punctuation">.</span>io<span class="token operator">/</span>json_to_dart<span class="token operator">/</span>
 网站<span class="token number">2</span>： https<span class="token punctuation">:</span><span class="token operator">/</span><span class="token operator">/</span>app<span class="token punctuation">.</span>quicktype<span class="token punctuation">.</span>io<span class="token operator">/</span>

</code></pre><hr>
<h2 id="5-主题管理">5. 主题管理 </h2>
<h3 id="51-定义主题">5.1 定义主题 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token comment">// app/theme.dart</span>
<span class="token keyword keyword-class">class</span> <span class="token class-name">FThemeData</span> <span class="token punctuation">{</span>
  <span class="token keyword keyword-final">final</span> <span class="token class-name">BuildContext</span> context<span class="token punctuation">;</span>
  <span class="token class-name">FThemeData</span><span class="token punctuation">(</span><span class="token keyword keyword-this">this</span><span class="token punctuation">.</span>context<span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token class-name">ThemeData</span> <span class="token keyword keyword-get">get</span> app <span class="token operator">=</span><span class="token operator">&gt;</span> <span class="token class-name">ThemeData</span><span class="token punctuation">(</span>
        useMaterial3<span class="token punctuation">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span>
        fontFamily<span class="token punctuation">:</span> <span class="token string-literal"><span class="token string">"PingFang"</span></span><span class="token punctuation">,</span>
        splashFactory<span class="token punctuation">:</span> <span class="token class-name">NoSplash</span><span class="token punctuation">.</span>splashFactory<span class="token punctuation">,</span>
        highlightColor<span class="token punctuation">:</span> <span class="token class-name">Colors</span><span class="token punctuation">.</span>transparent<span class="token punctuation">,</span>
        scaffoldBackgroundColor<span class="token punctuation">:</span> <span class="token class-name">FColor</span><span class="token punctuation">.</span>bgColor<span class="token punctuation">,</span>
        appBarTheme<span class="token punctuation">:</span> appBarThemeLight<span class="token punctuation">,</span>
        elevatedButtonTheme<span class="token punctuation">:</span> <span class="token class-name">ElevatedButtonThemeData</span><span class="token punctuation">(</span>
            style<span class="token punctuation">:</span> <span class="token class-name">ButtonStyle</span><span class="token punctuation">(</span>
                backgroundColor<span class="token punctuation">:</span> <span class="token class-name">WidgetStateProperty</span><span class="token punctuation">.</span><span class="token function">all</span><span class="token punctuation">(</span><span class="token class-name">Colors</span><span class="token punctuation">.</span>transparent<span class="token punctuation">)</span><span class="token punctuation">,</span>
                elevation<span class="token punctuation">:</span> <span class="token class-name">WidgetStateProperty</span><span class="token punctuation">.</span><span class="token function">all</span><span class="token punctuation">(</span><span class="token number">0</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
      <span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token class-name">AppBarTheme</span> <span class="token keyword keyword-get">get</span> appBarThemeLight <span class="token operator">=</span><span class="token operator">&gt;</span> <span class="token class-name">AppBarTheme</span><span class="token punctuation">(</span>
        elevation<span class="token punctuation">:</span> <span class="token number">0</span><span class="token punctuation">,</span>
        centerTitle<span class="token punctuation">:</span> <span class="token boolean">true</span><span class="token punctuation">,</span>
        backgroundColor<span class="token punctuation">:</span> <span class="token class-name">FColor</span><span class="token punctuation">.</span>appBrandColor<span class="token punctuation">,</span>
        iconTheme<span class="token punctuation">:</span> <span class="token keyword keyword-const">const</span> <span class="token class-name">IconThemeData</span><span class="token punctuation">(</span>
          color<span class="token punctuation">:</span> <span class="token class-name">Colors</span><span class="token punctuation">.</span>white<span class="token punctuation">,</span>
        <span class="token punctuation">)</span><span class="token punctuation">,</span>
        titleTextStyle<span class="token punctuation">:</span> <span class="token class-name">TextStyle</span><span class="token punctuation">(</span>color<span class="token punctuation">:</span> <span class="token class-name">Colors</span><span class="token punctuation">.</span>white<span class="token punctuation">,</span> fontSize<span class="token punctuation">:</span> <span class="token number">25.</span>sp<span class="token punctuation">)</span><span class="token punctuation">,</span>
      <span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
</code></pre><h2 id="5-缓存管理">5. 缓存管理 </h2>
<h3 id="51-定义缓存">5.1 定义缓存 </h3>
<pre data-role="codeBlock" data-info="dart" class="language-dart dart"><code><span class="token comment">// sp_cache.dart</span>

<span class="token keyword keyword-class">class</span> <span class="token class-name">SpCache</span>  <span class="token punctuation">{</span>
   <span class="token comment">// 缓存token</span>
   <span class="token keyword keyword-static">static</span> <span class="token class-name">Future</span><span class="token generics"><span class="token punctuation">&lt;</span>bool<span class="token operator">?</span><span class="token punctuation">&gt;</span></span> <span class="token function">saveToken</span><span class="token punctuation">(</span><span class="token class-name">String</span> token<span class="token punctuation">)</span> <span class="token keyword keyword-async">async</span> <span class="token punctuation">{</span>
    <span class="token keyword keyword-return">return</span> <span class="token keyword keyword-await">await</span> <span class="token class-name">SpUtil</span><span class="token punctuation">.</span><span class="token function">putString</span><span class="token punctuation">(</span><span class="token class-name">Constant</span><span class="token punctuation">.</span>token<span class="token punctuation">,</span> token<span class="token punctuation">)</span><span class="token punctuation">;</span>
   <span class="token punctuation">}</span>
   <span class="token comment">//获取token</span>
   <span class="token keyword keyword-static">static</span> <span class="token class-name">String</span> <span class="token function">getToken</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
     <span class="token keyword keyword-return">return</span> <span class="token class-name">SpUtil</span><span class="token punctuation">.</span><span class="token function">getString</span><span class="token punctuation">(</span><span class="token class-name">Constant</span><span class="token punctuation">.</span>token<span class="token punctuation">)</span> <span class="token operator">?</span><span class="token operator">?</span> <span class="token string-literal"><span class="token string">''</span></span><span class="token punctuation">;</span>
   <span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre>
      </div>
      
      
    
    
    
    
    
    
  
    </body></html>